layui.use(['form', 'admin', 'ax', 'table', 'treetable'], function () {
    var $ax = layui.ax;
    var admin = layui.admin;
    var table = layui.table;
    var treetable = layui.treetable;
    var form = layui.form;

    var Current = {
        tableId: "table"
    };

    Current.initColumn = function () {
        return [[
            {type: 'numbers'},
            {field: 'id', hide: true, sort: true, title: 'id'},
            {field: 'serviceId', sort: false, title: '服务名称'},
            {field: 'ipPort', sort: false, title: 'IP端口'},
            {
                field: 'metadata', sort: false, title: 'metadata', templet: function (d) {
                    return d.metadata === null ? '' : JSON.stringify(d.metadata)
                }
            },
            {
                field: 'status', sort: false, title: '服务状态', templet: function (d) {
                    return d.status === null ? '' : d.status === 'UP' ? '<span style="    background-color: #f0f9eb;\n' +
                        '    border-color: #e1f3d8;\n' +
                        '    color: #67c23a;\n' +
                        '    display: inline-block;\n' +
                        '    height: 32px;\n' +
                        '    padding: 0 10px;\n' +
                        '    line-height: 30px;\n' +
                        '    font-size: 12px;\n' +
                        '    border-width: 1px;\n' +
                        '    border-style: solid;\n' +
                        '    border-radius: 4px;">正常</span>' : ''
                }
            },
            {align: 'center', toolbar: '#tableBar', title: '操作', minWidth: 350}
        ]];
    };

    Current.initTable = function (tableId, data) {
        return treetable.render({
            elem: '#' + tableId,
            url: system.contextPath + '/api/service.instance.lists',
            where: data,
            page: false,
            height: "full-158",
            cellMinWidth: 100,
            cols: Current.initColumn(),
            treeColIndex: 2,
            treeSpid: "0",
            treeIdName: "id",
            treePidName: "parentId",
            treeDefaultClose: true,
            treeLinkage: false
            , isJump: true //是否允许点击节点时弹出新窗口跳转
            , showLine: true  //是否开启连接线
            , size: 'lg',
            done: function (res, curr, count) {
                count || this.elem.next('.layui-table-view').find('.layui-table-header').css('overflow', 'visible');
                $('.layui-table-body').find('div.layui-table-cell').find('select').each(function () {
                    var $this = $(this);
                    var val = $this.data('value');
                    var text;
                    $(this).children().each(function () {
                        if (val == this.value) {
                            text = this.text;
                            return;
                        }
                    })
                    //更新layui 选择器输入框的值
                    $this.next().find('.layui-select-title').find('input').val(text);
                    //更新layui 选择器的值 以及设置其样式
                    $this.val(val).parents('div.layui-table-cell').css('overflow', 'visible');
                })
                form.render(null, 'table');
            }
        });
    };

    // 渲染表格
    var tableResult = Current.initTable(Current.tableId);

    $('#expandAll').click(function () {
        treetable.expandAll('#' + Current.tableId);
    });
    $('#foldAll').click(function () {
        treetable.foldAll('#' + Current.tableId);
    });
    // 添加按钮点击事件
    $('#btnAdd').click(function () {
        Current.onAdd();
    });

    // 工具条点击事件
    table.on('tool(' + Current.tableId + ')', function (obj) {
        var data = obj.data;
        var layEvent = obj.event;

        if (layEvent === 'edit') {
            Current.onEdit(data);
        } else if (layEvent === 'delete') {
            Current.onDelete(data);
        } else if (layEvent === 'add') {
            Current.onAdd(data);
        } else if (layEvent === 'setMenu') {
            Current.setMenu(data);
        }
    });
});
